<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:thSys="">
<div th:replace="admin/module/macros :: head('菜单管理')"></div>
<body class="app sidebar-mini rtl">
	<main class="app-content">
	<div th:replace="admin/module/macros :: header"></div>
	<div th:replace="admin/module/macros :: sidebar"></div>
	<div class="app-title">
		<div>
			<h1>菜单管理</h1>
		</div>
		<ul class="app-breadcrumb breadcrumb">
			<li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
			<li class="breadcrumb-item"><a href="#">菜单管理</a></li>
		</ul>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="tile">
				<div class="row">
					<div class="col-lg-5">
					<th:block th:if="${menu} == null">
					<h4 class="tile-title">添加菜单</h4>
					</th:block>
					<th:block th:if="${menu} != null">
					<h4 class="tile-title">修改菜单</h4>
					</th:block>
						<form action="/admin/menus/save" method="post">
						<input type="hidden" name="menuId" id="menuId"
								th:value="${menu != null ? menu.menuId :''}">
							<div class="form-group">
								<label class="col-form-label">*名称</label> <input
									class="form-control" th:value="${menu != null ?menu.menuName : ''}" name="menuName" type="text">
							</div>
							<div class="form-group">
								<label class="col-form-label">*路径</label> <input
									class="form-control" th:value="${menu != null ?menu.menuUrl : ''}" name="menuUrl" type="text">
							</div>
							<div class="form-group">
								<label class="col-form-label">*排序编号</label> <input
									class="form-control" th:value="${menu != null ?menu.menuSort : ''}" name="menuSort" type="text">
							</div>
							<div class="form-group">
								<label class="col-form-label">图标</label> <input
									class="form-control" th:value="${menu != null ?menu.menuIcon : ''}" name="menuIcon" type="text">
							</div>
							<div class="form-group">
								<label>打开方式</label><select
									class="form-control" name="menuTarget">
									<option th:selected="${menu != null ? menu.menuTarget=='_blank' : ''}" value="_blank">新窗口</option>
									<option th:selected="${menu != null ? menu.menuTarget=='_self' : ''}" value="_self">当前窗口</option>
								</select>
							</div>
							<div class="tile-footer">
								<button class="btn btn-sm btn-outline-primary" type="submit">保存菜单</button>
							<th:block th:if="${menu} != null">
									<a class="btn btn-sm btn-outline-info" href="/admin/menus">返回添加</a>
								</th:block>
							</div>
						</form>
					</div>
					<div class="col-lg-7">
						<h4 class="tile-title">所有菜单</h4>
						<div class="table-responsive">
							<table class="table">
								<thead>
									<tr>
										<th>名称</th>
										<th>路径</th>
										<th>排序</th>
										<th>图标</th>
										<th>操作</th>
									</tr>
								</thead>
								<tbody>
									<tr th:each="menu : ${menus}">
										<td th:text="${menu.menuName}"></td>
										<td th:text="${menu.menuUrl}"></td>
										<td th:text="${menu.menuSort}"></td>
										<td th:text="${menu.menuIcon}"></td>
										<td><a class="btn btn-sm btn-outline-primary"
											th:href="@{/admin/menus/edit(menuId=${menu.menuId})}">修改</a>
											<button class="btn btn-sm btn-outline-danger"
												th:onclick="'javascript:showModel('+${menu.menuId}+')'">删除</button>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>

			</div>
		</div>
	</div>
	</main>
	<!-- 删除确认弹出层 -->
	<div th:replace="admin/module/macros :: remove"></div>
	<div th:replace="admin/module/macros :: comm" ></div>
	<div th:replace="admin/module/macros :: bootstrapValidator"></div>
	<script type="text/javascript">
	$(function(){
		$("form").bootstrapValidator({
			message: 'This value is not valid',
           　		feedbackIcons: {
               　　　　　　　　valid: 'glyphicon glyphicon-ok',
               　　　　　　　　invalid: 'glyphicon glyphicon-remove',
               　　　　　　　　validating: 'glyphicon glyphicon-refresh'
           　　　　　　　　   },
            fields: {
            	menuName: {
                   message: '名称验证失败',
                   validators: {
                       notEmpty: {
                           message: '名称不能为空'
                       }
                   }
               },
               menuUrl: {
            	   message: '路径验证失败',
                   validators: {
                       notEmpty: {
                           message: '路径不能为空'
                       }
                   }
               },
               menuSort: {
            	   message: '排序编号验证失败',
                   validators: {
                       notEmpty: {
                           message: '排序编号不能为空'
                       }
                   }
               },
           }
		});
	});
	function showModel(menuId) {
		$("#menuId").val(menuId);
		$("#removeModal").modal();
	}
	function remove() {
		window.location.href = "/admin/menus/remove?menuId="
				+ $("#menuId").val();
	}
	</script>
</body>
</html>